<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link href="css/style.css" rel="stylesheet" />

	</head>

	<body>

		<header class="mui-bar mui-bar-nav header">
			<a class="mui-action-back mui-icon mui-icon-arrowthinleft mui-pull-left"></a>
			<h1 class="mui-title">编辑地址</h1>
			<a href="" class="mui-pull-right sharing">
				<span class="tm-df-size tm-font-green tm-font-bold">保存</span>
			</a>
		</header>

		<div class="mui-content">

			<!--block-->
			<div class="uk-clearfix uk-margin-small-top">
				<div class="main-input-group">
					
				<div class="mui-table-view mui-in-zero uk-text-xsmall">
					<div class="mui-table-view-cell">
						<div class="tm-flex flex-align-center">
							<div class="tm-5em tm-flex-head">
								收货人
							</div>
							<div class="tm-flex-1">
								<input class="tm-input" type="text" value="会飞的猫" placeholder="请填写收货人" />
							</div>
						</div>
					</div>

					<div class="mui-table-view-cell">
						<div class="tm-flex flex-align-center">
							<div class="tm-5em tm-flex-head">
								联系电话
							</div>
							<div class="tm-flex-1">
								<input class="tm-input" type="tel" value="18600000000" placeholder="请填写联系电话" />
							</div>

						</div>
					</div>

					<div class="mui-table-view-cell">
						<div class="mui-navigate-right">
							<div class="tm-cell-pad">
								<div class="tm-flex flex-align-center">
									<div class="tm-5em tm-flex-head">
										所在地区
									</div>
									<div class="tm-input-body">
										<input id='city-picker' class="tm-input uk-text-right" type="text" value="湖北省 武汉市 武昌区" placeholder="请选择" readonly />
									</div>
								</div>
							</div>
						</div>
					</div>

					<div class="mui-table-view-cell">
						<div class="mui-navigate-right">
							<div class="tm-cell-pad">
								<div class="tm-flex flex-align-center">
									<div class="tm-5em tm-flex-head">
										所在街道
									</div>
									<div class="tm-flex-1">
										<input id='picker' class="tm-input uk-text-right" type="text" value="中南路" placeholder="请选择" readonly />
									</div>
								</div>
							</div>
						</div>
					</div>

					<div class="mui-table-view-cell">
						<div class="">
							<div class="tm-input-body">
								<textarea class="addres-textarea" rows="5" placeholder="请输入详细地址，不少于5个字">中建广场C座24F</textarea>
							</div>
						</div>
					</div>

				</div>
			
				</div>
			</div>
			<!--/block-->

			<!--block-->
			<div class="uk-clearfix uk-margin-xsmall">
				<div class="mui-table-view mui-in-zero uk-text-xsmall">
					<div class="mui-table-view-cell">
						<a class="uk-text-center tm-font-orange" href="javascript:;">
							删除地址
						</a>
					</div>

				</div>
			</div>
			<!--/block-->

		</div>

		<!-- JS -->
		<script src="js/mui.min.js"></script>
		<script src="js/jquery.min.js"></script>
		<script src="js/uikit.min.js"></script>
		<script src="js/jquery-weui.min.js"></script>
		<script src="js/components/sticky.min.js"></script>
		<script src="js/swiper.min.js"></script>
		<script src="js/layer/layer.js"></script>

		<script src="js/city-picker.min.js" charset="utf-8"></script>

		<script src="js/main.js"></script>
		<!-- /JS -->
		<!-- Init -->

		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>

		<script>
			$("#city-picker").cityPicker({
				title: "选择所在地区",
				onChange: function(picker, values, displayValues) {
					console.log(values, displayValues);
				}
			});

			$("#picker").picker({
				title: "选择所在街道",
				cols: [{
					textAlign: 'center',

					values: ['中南路0', '中南路', '中南路2', '中南路3', '中南路4', '中南路5']
				}]
			});
		</script>

		<!--/ Init -->

	</body>

</html>